import {lazy,Suspense} from "react"
import {Navigate} from "react-router-dom"

//首页  登录 注册 404  一般不需要懒加载
import Home from "../pages/Home/Home"
import Redux from "../pages/Redux/Redux"
import NotFound from "../pages/NotFound"
//懒加载组件
let TodoList = lazy(()=>import("../pages/TodoList/TodoList"))
let Heros = lazy(()=>import("../pages/Heros/Heros"))
let Duanzi = lazy(()=>import("../components/Duanzi/Duanzi"))
let News = lazy(()=>import("../pages/News"))
let Guonei = lazy(()=>import("../pages/News/Guonei"))
let Guoji = lazy(()=>import("../pages/News/Guoji"))
let Heroscon = lazy(()=>import("../pages/Heros/Heroscon"))
let Ref = lazy(()=> import("../pages/Ref/Ref"));
let Hooks = lazy( ()=> import("../pages/Hooks/Hooks"));

//封装懒加载函数
let load = (Component) => {
    return <Suspense fallback={<div>正在加载中...</div>}>
                <Component/>
            </Suspense>
}

export default [
    {
        path:"/",   //路由地址
        element:<Home/>,  //路由组件
        meta:{  //路由元信息
            title:"首页"
        }
    },
    {
        path:"/redux",   //路由地址
        element:<Redux/>,  //路由组件
        meta:{  //路由元信息
            title:"redux"
        }
    },
    {
        path:"/ref",
        element:load(Ref),
        meta:{  //路由元信息
            title:"ref"
        }
    },
    {
        path:"/hooks",
        element:load(Hooks),
        meta:{  //路由元信息
            title:"hooks"
        }
    },
    {
        path:"/todolist",
        element:load(TodoList),
        meta:{  //路由元信息
            title:"todolist"
        }
    },
    {
        path:"/heros",
        element:load(Heros),
        meta:{  //路由元信息
            title:"英雄"
        }
    },
    /* {
        path:"/heroscon/:id/:name",
        element:<Heroscon/>,
        meta:{  //路由元信息
            title:"英雄详情",
            isHidden:true
        }
    }, */
    {
        path:"/heroscon",
        element:load(Heroscon),
        meta:{  //路由元信息
            title:"英雄详情",
            isHidden:true
        }
    },

    {
        path:"/duanzi",
        element:load(Duanzi),
        meta:{  //路由元信息
            title:"段子"
        }
    },
    {
        path:"/news",
        element:load(News),
        meta:{  //路由元信息
            title:"新闻"
        },
        children:[  //子路由
            {
                path:"/news/guonei",
                element:load(Guonei)
            },
            {
                path:"guoji",
                element:load(Guoji)
            },
            {
                index:true,
                element:<Navigate to="/news/guonei"/>
            }
        ]
    },
    {
        path:"*",   // * 通配符，代表所有路由地址
        element:<NotFound/>,
        meta:{
            title:"404",
            isHidden:true
        }
    }
]